<extend name="Public/baseConf"/>
<block name="breadcrumb"> 
	<div class="row wrapper border-bottom white-bg page-heading">
	    <div class="col-lg-6">
	        <h2>插件配置 [ {$data.title} ]</h2>
	        <ol class="breadcrumb">
	            <li><a href="{:U('index/index')}">首页</a></li>
	            <li><a href="{:U('Addons/index')}">插件列表</a></li>
	            <li class="active">
	                <strong>插件配置</strong>
	            </li>
	        </ol>
	    </div>
	    <div class="col-lg-6">
            <div class="title-action">
 				<button class="btn btn-primary ajax-post" id="submit" type="submit" target-form="form-horizontal"><i class="fa fa-check"></i>保存</button>
 				<button class="btn btn-warning" onclick="javascript:history.back(-1);return false;"><i class="fa fa-reply"></i>返回</button>
            </div>
        </div>
	</div>
</block>
<block name="body">
	<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
	<div class="row">
    <div class="col-lg-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>{$data.title}</h5>
                <div class="ibox-tools">
                    <a class="collapse-link">
                        <i class="fa fa-chevron-up"></i>
                    </a>
                </div>
            </div>
            <div class="ibox-content">
				<form action="{:U('saveConfig')}" class="form-horizontal" method="post">
					<empty name="custom_config">
						<foreach name="data['config']" item="form" key="o_key">
							<div class="form-group">
								<label class="col-sm-2 control-label">
									{$form.title|default=''}
									<present name="form.tip">
										<span class="check-tips">{$form.tip}</span>
									</present>
								</label>
								<switch name="form.type">
									<case value="text">
										<div class="col-sm-10">
											<input type="text" name="config[{$o_key}]" class="form-control" value="{$form.value}">
										</div>
									</case>
									<case value="password">
										<div class="col-sm-10">
											<input type="password" name="config[{$o_key}]" class="form-control" value="{$form.value}">
										</div>
									</case>
									<case value="hidden">
										<input type="hidden" name="config[{$o_key}]" value="{$form.value}">
									</case>
									<case value="radio">
										<div class="col-sm-10">
											<foreach name="form.options" item="opt" key="opt_k">
												<div class="radio radio-info radio-inline">
													<input id="config[{$o_key}]{$opt}" type="radio" name="config[{$o_key}]" value="{$opt_k}" <eq name="form.value" value="$opt_k"> checked="checked"</eq>>
		                                            <label for="config[{$o_key}]{$opt}">{$opt}</label>
		                                        </div>
											</foreach>
										</div>
									</case>
									<case value="checkbox">
										<div class="col-sm-10">
											<foreach name="form.options" item="opt" key="opt_k">
												<div class="checkbox checkbox-inline  checkbox-info">
													<php>
														is_null($form["value"]) && $form["value"] = array();
													</php>
													<input id="config[{$o_key}][]{$opt}" type="checkbox" name="config[{$o_key}][]" value="{$opt_k}" <in name="opt_k" value="$form.value"> checked="checked"</in>>
		                                            <label for="config[{$o_key}][]{$opt}"> {$opt} </label>
		                                        </div>
											</foreach>
										</div>
									</case>
									<case value="select">
										<div class="col-sm-10">
											<select name="config[{$o_key}]" class="form-control">
												<foreach name="form.options" item="opt" key="opt_k">
													<option value="{$opt_k}" <eq name="form.value" value="$opt_k"> selected</eq>>{$opt}</option>
												</foreach>
											</select>
										</div>
									</case>
									<case value="textarea">
									<div class="col-sm-10">
										<label class="textarea input-large">
											<textarea name="config[{$o_key}]" class="form-control">{$form.value}</textarea>
										</label>
									</div>
									</case>
									<case value="picture_union">
										<div class="col-sm-10">
											<input type="file" id="upload_picture_{$o_key}">
											<input type="hidden" name="config[{$o_key}]" id="cover_id_{$o_key}" value="{$form.value}"/>
											<div class="upload-img-box">
												<notempty name="form['value']">
												<php> $mulimages = explode(",", $form["value"]); </php>
												<foreach name="mulimages" item="one">
													<div class="upload-pre-item" val="{$one}">
														<img src="{$one|get_cover='path'}"  ondblclick="removePicture{$o_key}(this)"/>
													</div>
												</foreach>
												</notempty>
											</div>
										</div>
										<script type="text/javascript">
											//上传图片
											/* 初始化上传插件 */
											$("#upload_picture_{$o_key}").uploadify({
												"height"          : 30,
												"swf"             : "__STATIC__/uploadify/uploadify.swf",
												"fileObjName"     : "download",
												"buttonText"      : "上传图片",
												"uploader"        : "{:U('File/uploadPicture',array('session_id'=>session_id()))}",
												"width"           : 120,
												'removeTimeout'   : 1,
												'fileTypeExts'    : '*.jpg; *.png; *.gif;',
												"onUploadSuccess" : uploadPicture{$o_key},
												'onFallback' : function() {
										            alert('未检测到兼容版本的Flash.');
										        }
											});
		
											function uploadPicture{$o_key}(file, data){
												var data = $.parseJSON(data);
												var src = '';
												if(data.status){
													src = data.url || '__ROOT__' + data.path
													$("#cover_id_{$o_key}").parent().find('.upload-img-box').append(
														'<div class="upload-pre-item" val="' + data.id + '"><img src="__ROOT__' + src + '" ondblclick="removePicture{$o_key}(this)"/></div>'
													);
													setPictureIds{$o_key}();
												} else {
													updateAlert(data.info);
													setTimeout(function(){
														$('#top-alert').find('button').click();
														$(that).removeClass('disabled').prop('disabled',false);
													},1500);
												}
											}
											function removePicture{$o_key}(o){
												var p = $(o).parent().parent();
												$(o).parent().remove();
												setPictureIds{$o_key}();
											}
											function setPictureIds{$o_key}(){
												var ids = [];
												$("#cover_id_{$o_key}").parent().find('.upload-img-box').find('.upload-pre-item').each(function(){
													ids.push($(this).attr('val'));
												});
												if(ids.length > 0)
													$("#cover_id_{$o_key}").val(ids.join(','));
												else
													$("#cover_id_{$o_key}").val('');
											}
										</script>
									</case>
									<case value="group">
									<div class="tabs-container">
									
										<ul class="nav nav-tabs">
											<volist name="form.options" id="li">
												<li <eq name="i" value="1">class="active"</eq>>
													<a data-toggle="tab"  href="#tab{$i}"><i class="green fa fa-user  bigger-110"></i>{$li.title}</a>
												</li>
												
											</volist>
										</ul>
										<div class="tab-content">
											<volist name="form.options" id="tab">
												<div id="tab{$i}" class="tab-pane <eq name="i" value="1">active</eq>">
												<div class="panel-body">
													<foreach name="tab['options']" item="tab_form" key="o_tab_key">
													<div class="form-group">
													<label class="col-sm-2 control-label">
														{$tab_form.title|default=''}
														<present name="tab_form.tip">
															<span class="check-tips">{$tab_form.tip}</span>
														</present>
													</label>
													<div class="col-sm-10">
														<switch name="tab_form.type">
															<case value="text">
																<input type="text" name="config[{$o_tab_key}]" class="form-control" value="{$tab_form.value}">
															</case>
															<case value="password">
																<input type="password" name="config[{$o_tab_key}]" class="form-control" value="{$tab_form.value}">
															</case>
															<case value="hidden">
																<input type="hidden" name="config[{$o_tab_key}]" value="{$tab_form.value}">
															</case>
															<case value="radio">
																<foreach name="tab_form.options" item="opt" key="opt_k">
																	<div class="radio radio-info radio-inline">
																		<input id="config[{$o_tab_key}]{$opt}" type="radio" name="config[{$o_tab_key}]" value="{$opt_k}" <eq name="tab_form.value" value="$opt_k"> checked="checked"</eq>>
							                                            <label for="config[{$o_tab_key}]{$opt}">{$opt}</label>
							                                        </div>
																</foreach>
															</case>
															<case value="checkbox">
																<foreach name="tab_form.options" item="opt" key="opt_k">
																	<div class="checkbox checkbox-inline  checkbox-info">
																		<php> is_null($tab_form["value"]) && $tab_form["value"] = array();</php>
								                                		<input id="config[{$o_tab_key}][]{$opt}" type="checkbox" name="config[{$o_tab_key}][]" value="{$opt_k}" <in name="opt_k" value="$tab_form.value"> checked="checked"</in>>
							                                            <label for="config[{$o_tab_key}][]{$opt}">{$opt}</label>
							                                        </div>
																</foreach>
															</case>
															<case value="select">
																<select name="config[{$o_tab_key}]" class="form-control">
																	<foreach name="tab_form.options" item="opt" key="opt_k">
																		<option value="{$opt_k}" <eq name="tab_form.value" value="$opt_k"> selected</eq>>{$opt}</option>
																	</foreach>
																</select>
															</case>
															<case value="textarea">
																	<textarea name="config[{$o_tab_key}]" class="form-control">{$tab_form.value}</textarea>
															</case>
															<case value="picture_union">
																<div  class="form-control">
																<input type="file" id="upload_picture_{$o_tab_key}">
																<input type="hidden" name="config[{$o_tab_key}]" id="cover_id_{$o_tab_key}" value="{$tab_form.value}"/>
																<div class="upload-img-box">
																	<notempty name="tab_form['value']">
																	<php> $mulimages = explode(",", $tab_form["value"]); </php>
																	<foreach name="mulimages" item="one">
																		<div class="upload-pre-item" val="{$one}">
																			<img src="{$one|get_cover='path'}"  ondblclick="removePicture{$o_tab_key}(this)"/>
																		</div>
																	</foreach>
																	</notempty>
																</div>
																</div>
																<script type="text/javascript">
																	//上传图片
																	/* 初始化上传插件 */
																	$("#upload_picture_{$o_tab_key}").uploadify({
																		"height"          : 30,
																		"swf"             : "__STATIC__/uploadify/uploadify.swf",
																		"fileObjName"     : "download",
																		"buttonText"      : "上传图片",
																		"uploader"        : "{:U('File/uploadPicture',array('session_id'=>session_id()))}",
																		"width"           : 120,
																		'removeTimeout'   : 1,
																		'fileTypeExts'    : '*.jpg; *.png; *.gif;',
																		"onUploadSuccess" : uploadPicture{$o_tab_key},
																		'onFallback' : function() {
																            alert('未检测到兼容版本的Flash.');
																        }
																	});
			
																	function uploadPicture{$o_tab_key}(file, data){
																		var data = $.parseJSON(data);
																		var src = '';
																		if(data.status){
																			src = data.url || '__ROOT__' + data.path
																			$("#cover_id_{$o_tab_key}").parent().find('.upload-img-box').append(
																				'<div class="upload-pre-item" val="' + data.id + '"><img src="__ROOT__' + src + '" ondblclick="removePicture{$o_tab_key}(this)"/></div>'
																			);
																			setPictureIds{$o_tab_key}();
																		} else {
																			updateAlert(data.info);
																			setTimeout(function(){
																				$('#top-alert').find('button').click();
																				$(that).removeClass('disabled').prop('disabled',false);
																			},1500);
																		}
																	}
																	function removePicture{$o_tab_key}(o){
																		var p = $(o).parent().parent();
																		$(o).parent().remove();
																		setPictureIds{$o_tab_key}();
																	}
																	function setPictureIds{$o_tab_key}(){
																		var ids = [];
																		$("#cover_id_{$o_tab_key}").parent().find('.upload-img-box').find('.upload-pre-item').each(function(){
																			ids.push($(this).attr('val'));
																		});
																		if(ids.length > 0)
																			$("#cover_id_{$o_tab_key}").val(ids.join(','));
																		else
																			$("#cover_id_{$o_tab_key}").val('');
																	}
																</script>
															</case>
															</switch>
														</div>
														</div>
													</foreach>
												</div>
												</div>
											</volist>
									</div>
									</div>
									</case>
								</switch>
			
							</div>
						</foreach>
					<else />
					<present name="custom_config">
						{$custom_config}
					</present>
					</empty>
					<input type="hidden" name="id" value="{:I('id')}" readonly>
				</form>
            </div>
        </div>
    </div>
</div> 
</block>

<block name="script">
<script type="text/javascript" charset="utf-8">
	//导航高亮
	highlight_subnav('{:U('Addons/index')}');
	if($('ul.tab-nav').length){
		//当有tab时，返回按钮不显示
		$('.btn-warning').hide();
	}
	$(function(){
		//支持tab
		showTab();
	})
</script>
</block>
